<@dictionary fields="STATUS" ></@dictionary>
<div class="row">
	<div class="col-xs-12">
		<div class="box">
			<div class="box-header">
				<h3 class="box-title">字典管理</h3>
				<div class="box-tools pull-right">
					<@shiro.hasPermission name="system:config:dictionary:add">
						<a onclick="paramToListAjax();" class="btn btn-sm btn-primary" target="modal" modal="lg" href="${request.contextPath}/system/config/param/add">添加</a>
					</@shiro.hasPermission>
				</div>
			</div>
			<div class="box-body">
				<div class="clearfix">
					<form id="param-search-form" class="" >
						<div class="col-md-4">
							<div class="input-group date ">
								<div class="input-group-addon">
									<i class="fa fa-calendar"></i>
								</div>
								<input type="text"  class="form-control pull-right" name="beginCreatedTime" placeholder="选择开始时间...">
							</div>
						</div>
						<div class="col-md-4">
							<div class="input-group date ">
								<div class="input-group-addon">
									<i class="fa fa-calendar"></i>
								</div>
								<input type="text" class="form-control pull-right" name="endCreatedTime" placeholder="选择结束时间...">
							</div>
						</div>
						<div class="col-md-4">
							<div class="input-group">
								<span class="input-group-addon"><i class="fa fa-search"></i></span>
								<input type="text" class="form-control" name="name" placeholder="根据角色名称搜索...">
							</div>
						</div>
						<div class="col-md-4">
							<button type="button" onclick="paramReload();" class="btn btn-primary">搜索</button>
						</div>
					</form>
				</div>
				<div class="clearfix" style="padding-top: 15px;">
					<table id="dictionaryDataGrid"></table>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript" src="//cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>
<script type="text/javascript" src="//cdn.bootcss.com/bootstrap-table/1.2.0/locale/bootstrap-table-zh-CN.min.js"></script>

<script type="text/javascript">

	var tableModel = (function () {
		return{
			getHeight : function () {
				return $(window).height() - $('.content-header').outerHeight(true);
			},
			getState : function (value,row,index) {
				return value==1 ? "启用" : "禁用";
			}
		}
	})();
	window.operateEvents = {
        'click .remove': function (e, value, row, index) {
            layer.msg('暂不支持删除')
        }
    };
	$dictionaryDataGrid = $("#dictionaryDataGrid");
    $(function () {
        initDataGrid();
    });
    function initDataGrid(){
        $dictionaryDataGrid.bootstrapTable({
            height : tableModel.getHeight(),
            idField : "id",
            columns : [[
                {title: "名称", field: "name" },
                {title: "状态", field: "status",formatter : STATUSRender},
                {title: "创建时间", field: "createdTime", sortable: true},
                {title: "更新日期", field: "modifiedTime", sortable: true},
                {title: "操作", field: "operate", align: 'center', events: operateEvents, formatter: operateFormatter}
            ]],
            url : '/system/config/dictionary/treeGrid',
            queryParams: function(params){
                return params;
            },
            responseHandler : function (res) {
                return {
                    rows : res.result.pageInfo.list,
                    total : res.result.pageInfo.total
                }
            },
            search : true,
            searchOnEnterKey : true,
            sortName : 'createdTime',
            sortOrder : 'asc',
            pagination : true,
            sidePagination : 'server',
            pageSize: 20,
            pageList : [20, 40, 50, 100],
            showRefresh : true,
            showToggle : true
        });
    }

    function operateFormatter(value, row, index) {
        return [
            /*'<a href="/console/admin/from?uid='+row.uid+'" >',
            '<i class="glyphicon glyphicon-edit"></i>修改',
            '</a>  ',*/
            '<a class="remove" href="javascript:void(0);">',
            '<i class="glyphicon glyphicon-remove"></i>删除',
            '</a>'
        ].join('');
    }


</script>